<template>
	<view class="page">
		<view class="flex flex-col gap-4">
			<view class="store_item" v-for="item in list" :key="item.id">
				<view class="store_item_name">门店编号：
					<view class="store_item_value">{{ item.code }}</view>
				</view>
				<view class="store_item_name">名称：
					<view class="store_item_value">{{ item.name }}</view>
				</view>
				<view class="store_item_name">商户：
					<view class="store_item_value">{{ item.cuCustomerName }}</view>
				</view>
				<view class="store_item_name">省市区：
					<view class="store_item_value">{{ item.cuProvince }}{{ item.cuCity }}{{ item.cuArea }}</view>
				</view>
				<view class="store_item_name">详细地址：
					<view class="store_item_value">{{ item.address }}</view>
				</view>
				<view class="store_item_name">联系人：
					<view class="store_item_value">{{ item.linkor }}</view>
				</view>
				<!--        <view class="store_item_name">联系电话：-->
				<!--          <view class="store_item_value">{{ item.linkPhone }}</view>-->
				<!--        </view>-->
				<view class="store_item_name">设备数量：
					<view class="store_item_value">{{ item.deviceQty }}</view>
				</view>
				<view
					style="margin-top: 20rpx;display: flex;justify-content: flex-end;gap: 10rpx;border-top: 1px solid #eee; padding-top: 20rpx;">
					<wd-button size="small" @click="view(item)">查看设备</wd-button>
					<wd-button size="small" @click="viewVip(item)">查看会员</wd-button>
					<wd-button size="small" v-if="item.linkPhone" @click="call(item)" type="success">联系</wd-button>
				</view>
			</view>
		</view>
		<view class="empty" v-if="list.length == 0">
			<wd-status-tip image="content" tip="暂无门店记录" />
		</view>
		<view class="add_btn flex items-center justify-center" @click="addFun">
			<wd-icon name="add" size="22px"></wd-icon>
		</view>
	</view>

</template>


<script setup>
	import {
		ref,
	} from 'vue';
	import {
		onShow
	} from '@dcloudio/uni-app'
	import userApiService from '../../api/user';

	const list = ref([])

	onShow(() => {
		userApiService.getStoresList().then((res) => {
			list.value = res.records
		})
	})

	const call = (e) => {
		if (!e.linkPhone) return
		uni.makePhoneCall({
			phoneNumber: e.linkPhone
		})
	}

	const view = (e) => {
		uni.navigateTo({
			url: "/pages/form/equipment"
		})
	}
	const addFun = () => {
		uni.navigateTo({
			url: "/pages/mine/ApplyAdd"
		})
	}
	const viewVip = (e) => {
		uni.navigateTo({
			url: "/pages/user/index"
		})
	}
</script>


<style lang="scss" scoped>
	.empty {
		min-height: 80vh;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.add_btn {
		position: fixed;
		bottom: 120rpx;
		right: 40rpx;
		height: 100rpx;
		width: 100rpx;
		border-radius: 50%;
		box-shadow: 0 0 12px 0 rgba(#1b1b1b, .2);
		color: #fff;
		background-color: #3775E9;
	}

	.store_item {
		margin-bottom: 20rpx;
		background-color: #fff;
		padding: 20rpx;
		margin-left: 20rpx;
		margin-right: 20rpx;
		border-radius: 10rpx;
		color: #666;

		&_name {
			font-size: 14px;
			display: flex;
			align-items: center;
		}

		&_value {
			color: #333;
		}
	}
</style>